<div class="bpm-work">
  <div class="bpm-work-left-ex">
    <ul nz-menu [nzMode]="'inline'" style="height: 100%;">
      <li nz-menu-item (click)="menu.setTab('main')" [nzSelected]="true"><i nz-icon type="form"></i>申请表单</li>
      <li nz-menu-item (click)="loadHistory()"><i nz-icon type="ordered-list"></i>办理过程</li>
      <li *ngIf="bs.info.type!=='3'" nz-menu-item (click)="loadImage()"><i nz-icon type="sort-ascending"></i>流程图</li>
    </ul>
  </div>
  <div class="bpm-work-right-ex">
    <div class="bpm-work-right-ex-content">
      <div class="bpm-tabs" *ngIf="menu.curItem=='main'">
        <h2 class="bpm-tabs-title">
          安保设备审批
        </h2>
        <div class="bpm-tabs-sub">
          <div class="bpm-tabs-sub-ioc"></div>
          <div class="bpm-tabs-sub-h2">表单信息</div>
        </div>
        <table>
          <tr>
            <td class="form-text">
              <nz-form-label nzRequired class="form-label">设备类型</nz-form-label>
            </td>
            <td class="form-input">
              <nz-form-control class="form-control" [nzValidateStatus]="equipmentType.invalid?'error':'success'"
                nzHasFeedback>
                <nz-select class="fm-input" [disabled]="!bs.info.first" [(ngModel)]="bs.data.equipmentType" name="equipmentType" required
                  #equipmentType="ngModel">
                  <nz-option *ngFor="let option of typeDic.datas" [nzLabel]="option.display" [nzValue]="option.id">
                  </nz-option>
                  <nz-option *ngIf="typeDic.isLoading" nzDisabled nzCustomContent>
                    <i nz-icon type="loading" class="loading-icon"></i>加载中...
                  </nz-option>
                </nz-select>
              </nz-form-control>
            </td>
            <td class="form-text">
              <nz-form-label nzRequired class="form-label">设备型号</nz-form-label>
            </td>
            <td class="form-input">
              <nz-form-control class="form-control" [nzValidateStatus]="equipmentModel.invalid?'error':'success'"
                nzHasFeedback>
                <nz-select class="fm-input" [disabled]="!bs.info.first" [(ngModel)]="bs.data.equipmentModel" name="equipmentModel" required
                  #equipmentModel="ngModel">
                  <nz-option *ngFor="let option of modelDic.datas" [nzLabel]="option.display" [nzValue]="option.id">
                  </nz-option>
                  <nz-option *ngIf="modelDic.isLoading" nzDisabled nzCustomContent>
                    <i nz-icon type="loading" class="loading-icon"></i>加载中...
                  </nz-option>
                </nz-select>
              </nz-form-control>
            </td>
          </tr>
          <tr>
            <td class="form-text">
              <nz-form-label nzRequired class="form-label">生产厂家</nz-form-label>
            </td>
            <td class="form-input">
              <nz-form-control class="form-control" [nzValidateStatus]="produceFactory.invalid?'error':'success'"
                nzHasFeedback>
                <nz-select class="fm-input" [disabled]="!bs.info.first" [(ngModel)]="bs.data.produceFactory" name="produceFactory" required
                  #produceFactory="ngModel">
                  <nz-option *ngFor="let option of produceFactoryDic.datas" [nzLabel]="option.display"
                    [nzValue]="option.id">
                  </nz-option>
                  <nz-option *ngIf="produceFactoryDic.isLoading" nzDisabled nzCustomContent>
                    <i nz-icon type="loading" class="loading-icon"></i>加载中...
                  </nz-option>
                </nz-select>
              </nz-form-control>
            </td>
            <td class="form-text">
              <nz-form-label nzRequired class="form-label">设备序列号</nz-form-label>
            </td>
            <td class="form-input">
              <nz-form-control class="form-control" [nzValidateStatus]="equipmentSerial.invalid?'error':'success'"
                nzHasFeedback>
                <input nz-input [disabled]="!bs.info.first" [(ngModel)]="bs.data.equipmentSerial" name="equipmentSerial" required
                  #equipmentSerial="ngModel" />
              </nz-form-control>
            </td>
          </tr>
          <tr>
            <td class="form-text">
              <nz-form-label nzRequired class="form-label">出厂年月</nz-form-label>
            </td>
            <td class="form-input">
              <nz-form-control class="form-control" [nzValidateStatus]="!outTime?'error':'success'" nzHasFeedback>
                <nz-month-picker [disabled]="!bs.info.first" [(ngModel)]="outTime" required (ngModelChange)="setOutTime()"></nz-month-picker>
              </nz-form-control>
            </td>
            <td class="form-text">
              <nz-form-label nzRequired class="form-label">启用年月</nz-form-label>
            </td>
            <td class="form-input">
              <nz-form-control class="form-control" [nzValidateStatus]="!useTime?'error':'success'" nzHasFeedback>
                <nz-month-picker [disabled]="!bs.info.first" [(ngModel)]="useTime" required (ngModelChange)="setUseTime()"></nz-month-picker>
              </nz-form-control>
            </td>
          </tr>
          <tr>
            <td class="form-text">
              <nz-form-label nzRequired class="form-label">安装位置</nz-form-label>
            </td>
            <td class="form-input">
              <nz-form-control class="form-control" [nzValidateStatus]="position.invalid?'error':'success'"
                nzHasFeedback>
                <input nz-input [disabled]="!bs.info.first" [(ngModel)]="bs.data.position" name="position" required
                       #position="ngModel" />
              </nz-form-control>
            </td>
            <td class="form-text">
              <nz-form-label nzRequired class="form-label">使用单位</nz-form-label>
            </td>
            <td class="form-input">
              <nz-form-control class="form-control" [nzValidateStatus]="useUnit.invalid?'error':'success'"
                nzHasFeedback>
                <nz-select class="fm-input"
                           [disabled]="bs.data.useUnit" [(ngModel)]="bs.data.useUnit" name="useUnit" required #useUnit="ngModel">
                  <nz-option *ngFor="let option of unitDic.datas" [nzLabel]="option.display" [nzValue]="option.id">
                  </nz-option>
                  <nz-option *ngIf="unitDic.isLoading" nzDisabled nzCustomContent>
                    <i nz-icon type="loading" class="loading-icon"></i>加载中...
                  </nz-option>
                </nz-select>
              </nz-form-control>
            </td>
          </tr>
          <tr>
            <td class="form-text">
              <nz-form-label nzRequired class="form-label">所属监管局</nz-form-label>
            </td>
            <td class="form-input">
              <nz-form-control class="form-control" [nzValidateStatus]="regulatoryAuthority.invalid?'error':'success'"
                nzHasFeedback>
                <nz-select class="fm-input" [disabled]="!bs.info.first" [(ngModel)]="bs.data.regulatoryAuthority"
                  name="regulatoryAuthority" required #regulatoryAuthority="ngModel">
                  <nz-option *ngFor="let option of regulatoryAuthorityDic.datas" [nzLabel]="option.display"
                    [nzValue]="option.id">
                  </nz-option>
                  <nz-option *ngIf="regulatoryAuthorityDic.isLoading" nzDisabled nzCustomContent>
                    <i nz-icon type="loading" class="loading-icon"></i>加载中...
                  </nz-option>
                </nz-select>
              </nz-form-control>
            </td>
<!--            <td class="form-text">
              <nz-form-label nzRequired class="form-label">所属管理局</nz-form-label>
            </td>
            <td class="form-input">
              <nz-form-control class="form-control" [nzValidateStatus]="administration.invalid?'error':'success'"
                nzHasFeedback>
                <nz-select class="fm-input" [disabled]="!bs.info.first" [(ngModel)]="bs.data.administration" name="administration" required
                  #administration="ngModel">
                  <nz-option *ngFor="let option of administrationDic.datas" [nzLabel]="option.display"
                    [nzValue]="option.id">
                  </nz-option>
                  <nz-option *ngIf="administrationDic.isLoading" nzDisabled nzCustomContent>
                    <i nz-icon type="loading" class="loading-icon"></i>加载中...
                  </nz-option>
                </nz-select>
              </nz-form-control>
            </td>-->
          </tr>
          <tr>
            <td class="form-text">
              <nz-form-label class="form-label">备注(型号)</nz-form-label>
            </td>
            <td class="form-input form-textarea" colspan="3">
              <nz-form-control class="form-control" style="width: 98%;padding: 5px 0;">
                <textarea [disabled]="!bs.info.first" nz-input [(ngModel)]="bs.data.remarkModel"></textarea>
              </nz-form-control>
            </td>
          </tr>
          <tr>
            <td class="form-text">
              <nz-form-label class="form-label">备注(生产厂家)</nz-form-label>
            </td>
            <td class="form-input form-textarea" colspan="3">
              <nz-form-control class="form-control" style="width: 98%;padding: 5px 0;">
                <textarea [disabled]="!bs.info.first" nz-input [(ngModel)]="bs.data.remarkFactory"></textarea>
              </nz-form-control>
            </td>
          </tr>
        </table>
        <div class="bpm-tabs-sub">
          <div class="bpm-tabs-sub-ioc"></div>
          <div class="bpm-tabs-sub-h2">审批信息</div>
        </div>
        <!-- 复杂意见 -->
        <app-bpm-opinion [bpmServer]="bs"></app-bpm-opinion>
      </div>

      <div class="bpm-tabs" *ngIf="menu.curItem=='history'">
        <h2 class="bpm-tabs-title">
          办理过程
        </h2>
        <app-bpm-process [bpmServer]="bs"></app-bpm-process>
      </div>
      <div class="bpm-tabs" *ngIf="menu.curItem=='image'">
        <h2 class="bpm-tabs-title">
          流程图
        </h2>
        <app-bpm-image [bpmServer]="bs"></app-bpm-image>
      </div>
    </div>
  </div>

  <!-- 工具栏 -->
  <app-bpm-tool *ngIf="ss.mi.sa || ss.mi.abssxg" [bpmServer]="bs"></app-bpm-tool>

  <div class="content-loading" *ngIf="fs.isLoading || fs.isSaveing">
    <nz-spin [nzSize]="'large'"></nz-spin>
  </div>
</div>
